<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<title>vuejs练习</title>
	<link rel="stylesheet" type="text/css" href="index.css">
	<script type="text/x-template" id="item-template">
		<li>
			<div
					:class="{bold: isFolder}"
					@click="toggle"
					@dblclick="changeType">
				{{model.name}}
				<span v-if="isFolder">[{{open ? '-' : '+'}}]</span>
			</div>
			<ul v-show="open" v-if="isFolder">
				<item
						class="item"
						v-for="model in model.children"
						:model="model">
				</item>
				<li @click="addChild">+</li>
			</ul>
		</li>
	</script>
</head>
<body>
<p>(You can double click on an item to turn it into a folder.)</p>
<ul id="demo">
	<item
			class="item"
			:model="treeData">
	</item>
</ul>
<script src='../vue.min.js'></script>
<script src="index.js"></script>
</body>
</html>